<template>
    <div v-loading="loading">


        <!-- <el-button type="primary" @click="handleAddPatent">添加</el-button>
        <el-button type="primary" @click="studentGetPatent">刷新</el-button> -->

        <el-form :model="searchForm">
            <el-row>
                <el-col :span="7" class="serach-padding">
                    <el-form-item label="成果创建时间">
                        <el-date-picker v-model="searchForm.dateRange" type="daterange" value-format="YYYY-MM-DD"
                            range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
                    </el-form-item>
                </el-col>
                <el-col :span="5" class="serach-padding">
                    <el-form-item label="审核状态">
                        <el-select v-model="searchForm.reviewStatusId" placeholder="请选择" width="150px">
                            <el-option label="待审核" value="1"></el-option>
                            <el-option label="审核中" value="2"></el-option>
                            <el-option label="审核通过" value="3"></el-option>
                            <el-option label="审核拒绝" value="4"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="5" class="serach-padding">
                    <el-form-item>
                        <el-button @click="searchPatent">查询</el-button>
                        <el-button @click="clearSearchOption">清空</el-button>
                    </el-form-item>

                </el-col>
                <div class="flex-grow"></div>
                <el-button @click="handleAddPatent">添加</el-button>
                <el-button @click="studentGetPatent">刷新</el-button>
            </el-row>

        </el-form>



        <!--专利表格-->
        <el-table :data="achievementPatent" style="width: 100%; margin-top: 10px;" stripe :border="true">
            <el-table-column fixed="left" prop="createdDate" label="创建时间" width="110" ></el-table-column>
            <el-table-column fixed="left" prop="reviewStatus" label="审核状态" width="100" ></el-table-column>
            <el-table-column prop="patentName" label="专利名称" width="150" show-overflow-tooltip></el-table-column>
            <el-table-column prop="patentProperty" label="专利属性" width="100" show-overflow-tooltip></el-table-column>
            <el-table-column prop="patentType" label="专利类别" width="100" show-overflow-tooltip></el-table-column>
            <el-table-column prop="authorizationStatus" label="授权状态" width="100"
                show-overflow-tooltip></el-table-column>
            <el-table-column prop="applicationNumber" label="申请号" width="130" show-overflow-tooltip></el-table-column>
            <el-table-column prop="publicationNumber" label="公开号" width="130" show-overflow-tooltip></el-table-column>
            <el-table-column prop="authorizationNumber" label="授权号" width="130" show-overflow-tooltip></el-table-column>
            <el-table-column prop="inventors" label="发明人" width="200" show-overflow-tooltip></el-table-column>
            <el-table-column prop="patentOwner" label="专利权人" width="150" show-overflow-tooltip></el-table-column>
            <el-table-column prop="applicationDate" label="申请日期" width="100" show-overflow-tooltip></el-table-column>
            <el-table-column prop="authorizationDate" label="授权日期" width="100" show-overflow-tooltip></el-table-column>
            <el-table-column prop="patentCertificate" label="专利证书" width="130" show-overflow-tooltip></el-table-column>
            <el-table-column prop="submissionDate" label="填报日期" width="100" show-overflow-tooltip></el-table-column>
            <el-table-column fixed="right" label="操作" width="70">
                <template #default="scope">
                    <el-row>
                        <el-button type="primary" @click="handleChangePatent(scope.row)" size="small">操作</el-button>
                    </el-row>
                </template>
            </el-table-column>
        </el-table>

        <!--添加专利-->
        <el-dialog v-model="dialogAddPatentVisible" title="添加专利">
            <el-form ref="formRef" :model="studentAddPatentInfo" label-width="120px" hide-required-asterisk>
                <el-form-item label="专利名称" prop="patentName">
                    <el-input v-model="studentAddPatentInfo.patentName"></el-input>
                </el-form-item>
                <el-form-item label="专利性质" prop="patentProperty">
                    <el-input v-model="studentAddPatentInfo.patentProperty"></el-input>
                </el-form-item>
                <el-form-item label="专利类型" prop="patentType">
                    <el-input v-model="studentAddPatentInfo.patentType"></el-input>
                </el-form-item>
                <el-form-item label="授权状态" prop="authorizationStatus">
                    <el-input v-model="studentAddPatentInfo.authorizationStatus"></el-input>
                </el-form-item>
                <el-form-item label="申请号" prop="applicationNumber">
                    <el-input v-model="studentAddPatentInfo.applicationNumber"></el-input>
                </el-form-item>
                <el-form-item label="公开号" prop="publicationNumber">
                    <el-input v-model="studentAddPatentInfo.publicationNumber"></el-input>
                </el-form-item>
                <el-form-item label="授权号" prop="authorizationNumber">
                    <el-input v-model="studentAddPatentInfo.authorizationNumber"></el-input>
                </el-form-item>
                <el-form-item label="发明人" prop="inventors">
                    <el-input v-model="studentAddPatentInfo.inventors"></el-input>
                </el-form-item>
                <el-form-item label="专利权人" prop="patentOwner">
                    <el-input v-model="studentAddPatentInfo.patentOwner"></el-input>
                </el-form-item>
                <el-form-item label="申请日期" prop="applicationDate">
                    <el-date-picker v-model="studentAddPatentInfo.applicationDate" type="date" placeholder="选择日期"
                        value-format="YYYY-MM-DD"></el-date-picker>
                </el-form-item>
                <el-form-item label="授权日期" prop="authorizationDate">
                    <el-date-picker v-model="studentAddPatentInfo.authorizationDate" type="date" placeholder="选择日期"
                        value-format="YYYY-MM-DD"></el-date-picker>
                </el-form-item>
                <el-form-item label="专利证书" prop="patentCertificate">
                    <el-input type="textarea" v-model="studentAddPatentInfo.patentCertificate"></el-input>
                </el-form-item>
                <el-form-item label="填报日期" prop="submissionDate">
                    <el-date-picker v-model="studentAddPatentInfo.submissionDate" type="date" placeholder="选择日期"
                        value-format="YYYY-MM-DD"></el-date-picker>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="studentAddPatent">添加</el-button>
                    <el-button @click="dialogAddPatentVisible = false">取消</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>

        <!--操作专利-->
        <el-dialog title="修改专利" v-model="dialogChangePatentVisible" width="80%">
            <el-form :model="studentAddPatentInfo" label-width="120px">
                <el-form-item label="专利名称">
                    <el-input v-model="currentPatentInfo.patentName" :disabled="!editModel"></el-input>
                </el-form-item>
                <el-form-item label="专利属性">
                    <el-input v-model="currentPatentInfo.patentProperty" :disabled="!editModel"></el-input>
                </el-form-item>
                <el-form-item label="专利类型">
                    <el-input v-model="currentPatentInfo.patentType" :disabled="!editModel"></el-input>
                </el-form-item>
                <el-form-item label="授权状态">
                    <el-input v-model="currentPatentInfo.authorizationStatus" :disabled="!editModel"></el-input>
                </el-form-item>
                <el-form-item label="申请号">
                    <el-input v-model="currentPatentInfo.applicationNumber" :disabled="!editModel"></el-input>
                </el-form-item>
                <el-form-item label="公开号">
                    <el-input v-model="currentPatentInfo.publicationNumber" :disabled="!editModel"></el-input>
                </el-form-item>
                <el-form-item label="授权号">
                    <el-input v-model="currentPatentInfo.authorizationNumber" :disabled="!editModel"></el-input>
                </el-form-item>
                <el-form-item label="发明人">
                    <el-input v-model="currentPatentInfo.inventors" :disabled="!editModel"></el-input>
                </el-form-item>
                <el-form-item label="专利权人">
                    <el-input v-model="currentPatentInfo.patentOwner" :disabled="!editModel"></el-input>
                </el-form-item>
                <el-form-item label="申请日期">
                    <el-date-picker v-model="currentPatentInfo.applicationDate" type="date" placeholder="选择日期"
                        value-format="YYYY-MM-DD" :disabled="!editModel"></el-date-picker>
                </el-form-item>
                <el-form-item label="授权日期">
                    <el-date-picker v-model="currentPatentInfo.authorizationDate" type="date" placeholder="选择日期"
                        value-format="YYYY-MM-DD" :disabled="!editModel"></el-date-picker>
                </el-form-item>
                <el-form-item label="专利证书">
                    <el-input v-model="currentPatentInfo.patentCertificate" :disabled="!editModel"></el-input>
                </el-form-item>
                <el-form-item label="填报日期">
                    <el-date-picker v-model="currentPatentInfo.submissionDate" type="date" placeholder="选择日期"
                        value-format="YYYY-MM-DD" :disabled="!editModel"></el-date-picker>
                </el-form-item>
            </el-form>
            <!-- <template #footer>
                <span class="dialog-footer">
                    <el-button @click="dialogChangePatentVisible = !dialogChangePatentVisible">取 消</el-button>
                    <el-button type="primary" @click="studentChangePatent">确 定</el-button>
                </span>
            </template> -->

            <template #footer>
                <span class="dialog-footer">
                    <el-button @click="dialogChangePatentVisible = !dialogChangePatentVisible">取 消</el-button>
                    <el-button type="primary" @click="studentChangePatent" v-show="editModel">保存修改</el-button>
                    
                    <el-button type="primary" @click="editModel = true" v-show="!editModel && !(currentPatentInfo.reviewStatus==='审核通过'|| currentPatentInfo.reviewStatus==='审核中' )">修改</el-button>
                    <el-button type="primary" v-show="!editModel && currentPatentInfo.reviewStatus==='审核中'" disabled >审核中</el-button>
                    <el-popconfirm title="是否确定提交审核？" @confirm="submitForReview" >
                        <template #reference>
                            <el-button type="primary" v-show="!editModel && (currentPatentInfo.reviewStatus==='待审核' || currentPatentInfo.reviewStatus==='审核拒绝') ">提交审核</el-button>
                        </template>
                    </el-popconfirm>
                    <el-button type="primary" v-show="!editModel && currentPatentInfo.reviewStatus==='审核拒绝'" @click="openRufuseMsg" >审核未通过原因</el-button>

                    <el-popconfirm title="是否确认删除这条记录？" @confirm="deletePatent">
                        <template #reference>
                            <el-button type="danger" v-show="!editModel && currentPatentInfo.reviewStatus!=='审核通过'">删除</el-button>
                        </template>
                    </el-popconfirm>
                </span>
            </template>
        </el-dialog>


    </div>



</template>

<script setup>
import http from '@/utils/axios.js'
import { reactive, ref, onMounted, computed } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'


// 审核成果
const submitForReview = () => {
    try {
        http.patch('/api/review/submit', {achievementId: currentPatentInfo.value.achievementId}
        ).then(res => {
            console.log(res);
            if (res.data.code === 4000) {
                ElMessage.success("提交审核成功！")
                dialogChangePatentVisible.value = false
                studentGetPatent()
            } else {
                ElMessage.error("提交审核失败：" + res.data.msg)
            }
        })
        
    } catch (error) {
        
    }
}

// 查看拒绝原因
const openRufuseMsg = () => {
  ElMessageBox.alert(currentPatentInfo.value.reviewComments, '拒绝原因')
}


// 搜索
var searchForm = reactive({})

const searchPatent = () => {
    console.log(searchForm);
    try {
        http.get('/api/achievement/patent/search', {
            params: {
                dateRangeStart: searchForm.dateRange?.[0],
                dateRangeEnd: searchForm.dateRange?.[1],
                reviewStatusId: searchForm.reviewStatusId
                
            }
        })
        .then(res => {

            achievementPatent.length = 0;
            Object.assign(achievementPatent, res.data)
            console.log(res)
        })

    } catch (error) {
        console.log(error);
    }
}

const clearSearchOption = () => {
    searchForm.dateRange = null,
    searchForm.reviewStatusId = null
    studentGetPatent()

}



// 从后端获取初始化数据
onMounted(() => {
    try {
        console.log("初始化数据")
        studentGetPatent()
        loading.value = false
    } catch (error) {
        console.error('Error fetching student home info:', error);
    }
})
const loading = ref(true)

// 获取专利数据
const achievementPatent = reactive([]);
const studentGetPatent = () => {
    http.get('/api/achievement/patent')
        .then(res => {
            Object.assign(achievementPatent, res.data);
            console.log(res);
        })
}

// 添加专利
const dialogAddPatentVisible = ref(false)
var studentAddPatentInfo = reactive({})
const handleAddPatent = () => {
    dialogAddPatentVisible.value = true
}
const studentAddPatent = async () => {
    console.log(studentAddPatentInfo);
    try {
        await http.post('/api/achievement/patent', studentAddPatentInfo)
            .then(res => {
                if (res.status === 200) {
                    res = res.data
                    if (res.code === 3000) {
                        studentGetPatent()
                        dialogAddPatentVisible.value = false
                        studentAddPatentInfo.length = 0
                        ElMessage.success('添加成功')
                    } else if (res.code === 3001) {
                        ElMessage.error('添加失败：' + res.data.msg)
                    }
                } else {
                    ElMessage.error('添加失败：未知原因')
                }
            })
    } catch (error) {
        console.log(error);
        ElMessage.error('添加失败：未知原因')
    }
}

// 删除专利
const deletePatent = async () => {
    console.log(achievementPatent.items)

    try {
        await http.delete('/api/achievement/patent', {
            data: { achievementId: currentPatentInfo.value.achievementId }
        })
            .then(res => {
                if (res.status === 200) {
                    res = res.data
                    if (res.code === 5000) {
                        // 使用 splice 方法删除数组中的项目
                        // const index = achievementPatent.findIndex(item => item.achievementId === currentPatentInfo.achievementId);
                        // if (index !== -1) {
                        //     achievementPatent.splice(index, 1);
                        // }
                        achievementPatent.length = 0
                        ElMessage.success('删除成功')
                        dialogChangePatentVisible.value = false

                        studentGetPatent()
                    } else if (res.code === 5001) {
                        ElMessage.error('删除失败：' + res.data.msg)
                    }
                } else {
                    ElMessage.error('删除失败：未知原因')
                }
            })

    } catch (error) {
        console.log(error);
        ElMessage.error('删除失败')
    }
}

// 修改专利
const editModel = ref(false)

const dialogChangePatentVisible = ref(false)
const currentPatentInfo = ref({})
var originalPatentName = ''
const handleChangePatent = (patent) => {
    currentPatentInfo.value = { ...patent };
    originalPatentName = currentPatentInfo.value.patentName
    dialogChangePatentVisible.value = true
    editModel.value = false
}
const studentChangePatent = async () => {
    try {
        if (originalPatentName === currentPatentInfo.value.patentName) {
            delete currentPatentInfo.value.patentName
        }

        await http.put('/api/achievement/patent', currentPatentInfo.value)
            .then(res => {
                if (res.status === 200) {
                    res = res.data
                    if (res.code === 4000) {

                        ElMessage.success('更新成功')
                        dialogChangePatentVisible.value = false
                        studentGetPatent()

                    } else if (res.code === 4001) {
                        ElMessage.error('更新失败：' + res.data.msg)
                    }
                } else {
                    ElMessage.error('更新失败：未知原因')
                }
            })
    } catch (error) {
        console.log(error);
        ElMessage.error('更新失败')
    }
}
</script>

<style scoped>
.flex-grow {
    flex-grow: 1;
}

.serach-padding {
    padding-right: 20px;
}
</style>